﻿@background-color: lighten(black, 5%);

#standings {
    position: absolute;
    top: 300px;
    left: 350px;
    width: 75%;
    height: 550px;
    background-color: @background-color;
    border: solid 5px lighten(black, 10%);
    text-align: center;
    font-size: small;
    color: white;

    table {
        width: 900px;
        margin-left: auto;
        margin-right: auto;

        th, td {
            text-align: center;
        }
    }

    .group-title {
        font-size: medium;
        font-weight: bold;
        margin: 10px;
    }

    .standings-row {
        position: relative;
        left: 0;
        text-align: left;
    }

    td.number {
        text-align: right;
    }

    .control {
        position: absolute;
        bottom: 65px;
        width: 100%;

        .btn {
            color: @background-color;
            top: -25px;
            position: absolute;
            color: white;
            opacity: 0.1;

            &:hover {
                opacity: 1.0;
            }
        }

        .btn-left {
            left: 20px;
        }

        .btn-right {
            right: 20px;
        }
    }
}
